<template>
  <div>
    <form action="/">
    <van-search @input="onInput"  @blur="ishow=true" @focus="ishow=false" background="#f6f5f6" v-model="value" :show-action="true" placeholder="请输入搜索关键词" >
      <template #label v-if="ishow">
      <div style="width:80px">
      </div>

    </template>
    </van-search>
     <!-- 搜索提示 -->
        <van-cell @click="jumpsearch(obj.communityName,obj.community)" v-for="(obj,index) in list" :key="index" :title="obj.communityName"  />
</form>
  </div>
</template>

<script>
import { getcommunity } from '@/api/hotel'
export default {
  data () {
    return {
      ishow: true,
      value: '',
      list: []
    }
  },

  created () {

  },

  methods: {
    onInput () {
      clearTimeout(this.timeId)
      this.timeId = setTimeout(async () => {
        const res = await getcommunity(this.value, this.$store.state.cityname.value)
        console.log(res)
        this.list = res.data.body
      }, 800)
    },
    jumpsearch (val, id) {
      this.$router.push({
        name: 'renthome',
        params: { val, id }
      })
    }
  }
}
</script>

<style scoped lang='less'>
/deep/.van-icon-search{
  color: #ccc;
}
/deep/.van-search__content{
  background-color: #fff;
}
</style>
